<template>
  <div>
    <div class="boxx">
      <div class="one">街道</div>
      <div @click="purpose(1)" :style="streetname!='请选择'?'color: black;' : ''" class="choose fsd">
        <div>{{streetname}}</div>
        <van-icon name="arrow" />
      </div>
    </div>
    <div class="boxx">
      <div class="one">社区</div>
      <div @click="purpose(2)" :style="communityname!='请选择'?'color: black;' : ''" class="choose fsd">
        <div>{{communityname}}</div>
        <van-icon name="arrow" />
      </div>
    </div>
    <div class="boxx">
      <div class="one">建筑物</div>
      <input class="two" v-model="jzwname" type="text" placeholder="请输入" />
    </div>
    <div class="boxx">
      <div class="one">物管名称</div>
      <input class="two" v-model="wuguan" type="text" placeholder="请输入" />
    </div>
    <div class="boxx">
      <div class="one">地址/姓名</div>
      <input class="two" v-model="address" type="text" placeholder="请输入" />
    </div>
    <div class="boxx">
      <div class="one">小区/楼栋</div>
      <input class="two" v-model="xiaoqu" type="text" placeholder="请输入" />
    </div>
    <div class="boxx">
      <div class="one">定位</div>
      <div @click="purpose(4)" :style="dingweiname!='请选择'?'color: black;' : ''" class="choose fsd">
        <div>{{dingweiname}}</div>
        <van-icon name="arrow" />
      </div>
    </div>
    <div class="boxx">
      <div class="one">附件</div>
      <div @click="purpose(5)" :style="fujianame!='请选择'?'color: black;' : ''" class="choose fsd">
        <div>{{fujianame}}</div>
        <van-icon name="arrow" />
      </div>
    </div>
    <div class="boxx">
      <div class="one">显示</div>
      <div @click="purpose(6)" :style="showname!='请选择'?'color: black;' : ''" class="choose fsd">
        <div>{{showname}}</div>
        <van-icon name="arrow" />
      </div>
    </div>
    <div @click="ok" class="yes">
      确定
    </div>

    <!-- 弹框-->
    <van-popup v-model="show">
      <div class="cont">
        <div class="list_one">
          <div class="list">
            <div>请选择</div>
            <img @click="show=false" src="../../assets/images/tk_x.png" />
          </div>
        </div>
        <div class="list_two">
          <div class="list" @click="choose(index)" v-for="(v,index) in list">
            <div>{{v.mc}}</div>
            <img v-if="index!==hh" src="../../assets/images/tk_g_false.png" />
            <img v-if="index==hh" src="../../assets/images/tk_g_true.png" />
          </div>
        </div>
      </div>
    </van-popup>
    <!-- 提示 -->
    <van-popup v-model="showtishi">
      <div style="width: 100%;">
        <div class="list_one">
          <div class="list">
            <div>请选择</div>
            <img @click="showtishi=false" src="../../assets/images/tk_x.png" />
          </div>
        </div>
        <div class="thishi_two">
          <div class="tishicont">{{tishiname}}</div>
          <div style="padding-bottom: 0.2rem;width: 100%;">
            <div class="thishiyes" @click="showtishi=false">确定</div>
          </div>
        </div>
      </div>
    </van-popup>

  </div>
</template>

<script>
  export default {
    name: 'zgfff',
    data() {
      return {
        zgfdwi: 1,
        tishiname: '',
        show: false, //弹框1用途
        showtishi: false,
        show1list: [{
          mc: "地图模式"
        }, {
          mc: "列表模式"
        }],
        showname: '请选择', //显示  选择的名字
        streetname: '请选择', //街道名字
        street_id: '', //街道id
        streetlist: '', //获取街道数据
        communityname: '请选择', //社区名字
        communitylist:[], //获取的社区数据
        communit_id: '', //选择的社区id
        dingweilist: [{
          mc: "不限",
          id: -1
        }, {
          mc: "有",
          id: 1
        }, {
          mc: "无",
          id: 0
        }],
        dingweiname: '请选择',
        fujianame: '请选择',
        fujian_id: '',
        dingwei_id: '',
        list: '', //弹框渲染列表
        hh: -1,
        userid: '',
        a: null,
        jzwname: '', //建筑物
        address: '', //地址输入
        wuguan: '',
        xiaoqu: '',
      }
    },
    methods: {
      purpose(fsd) {
        console.log(fsd)
        if (fsd == 6) {
          this.a = 6
          this.list = this.show1list
          if (this.showname == "请选择") {
            this.hh = -1
          } else {
            this.show1list.forEach((i, item) => {
              // console.log(i.mc)
              if (i.mc == this.showname) {
                this.hh = item
              }
            })
          }
          this.show = true
        } else if (fsd == 1) {
          this.a = 1
          this.list = this.streetlist
          if (this.streetname == "请选择") {
            this.hh = -1
          } else {
            this.streetlist.forEach((i, item) => {
              // console.log(i.mc)
              if (i.mc == this.streetname) {
                this.hh = item
              }
            })
          }
          this.show = true
        } else if (fsd == 2) {
          this.a = 2
          console.log(this.streetname)
          if (this.streetname == "请选择" || this.streetname == "不限") {
            this.$toast("请先选择街道")
          } else {
            this.list = this.communitylist
            console.log(this.communityname)
            console.log(this.hh)
            if (this.communityname == "请选择") {
              this.hh = -1
            } else {
              this.communitylist.forEach((i, item) => {
                if (i.mc == this.communityname) {
                  this.hh = item
                }
              })
            }
            this.show = true
          }
        } else if (fsd == 4) {
          this.a = 4
          this.list = this.dingweilist
          if (this.dingweiname == "请选择") {
            this.hh = -1
          } else {
            this.dingweilist.forEach((i, item) => {
              if (i.mc == this.dingweiname) {
                this.hh = item
              }
            })
          }
          this.show = true
        } else if (fsd == 5) {
          this.a = 5
          this.list = this.dingweilist
          if (this.fujianame == "请选择") {
            this.hh = -1
          } else {
            this.dingweilist.forEach((i, item) => {
              if (i.mc == this.fujianame) {
                this.hh = item
              }
            })
          }
          this.show = true
        }
      },
      choose(index) {
        console.log(this.a)
        if (this.a == 6) {
          this.hh = index
          this.showname = this.show1list[index].mc
        } else if (this.a == 1) {
          this.hh = index
          this.streetname = this.streetlist[index].mc
          this.street_id = this.streetlist[index].id
          this.communityname = "请选择"
          this.getcommunit()
        } else if (this.a == 2) {
          this.hh = index
          this.communityname = this.communitylist[index].mc
          this.communit_id = this.communitylist[index].id
        } else if (this.a == 4) {
          this.hh = index
          this.dingweiname = this.dingweilist[index].mc
          this.dingwei_id = this.dingweilist[index].id
        } else if (this.a == 5) {
          this.hh = index
          this.fujianame = this.dingweilist[index].mc
          this.fujian_id = this.dingweilist[index].id
        }
        this.show = false
      },
      getcommunit() {
        this.axios({
          methods: 'get',
          url: this.$global_msg.Url.host + '/queryFile/queryCommunity?sid=' + this.street_id,
        }).then((res) => {
          console.log(res)
          if (res.data.rows.length == 1) {
            this.communityname = res.data.rows[0].mc
            this.communit_id = res.data.rows[0].id
          } else {
            this.communitylist = res.data.rows
          }
        }).catch((err) => {
          console.log(err)
        })
      },
      ok() {
        try {
          plus.nativeUI.showWaiting("正在加载...");
        } catch (e) {
          console.log('plus问题');
        }
        this.jzwname =this.jzwname.replace(/\s+/g,"");
        this.wuguan =this.wuguan.replace(/\s+/g,"");
        this.xiaoqu =this.xiaoqu.replace(/\s+/g,"");
        this.address =this.address.replace(/\s+/g,"");
        console.log(this.street_id)
        console.log(this.communit_id)
        console.log(this.jzwname)
        console.log(this.wuguan)
        console.log(this.address)
        console.log(this.xiaoqu)
        console.log(this.dingwei_id)
        console.log(this.fujian_id)
        var session_id = []
        session_id[0] = this.street_id
        session_id[1] = this.communit_id
        session_id[2] = this.dingwei_id
        session_id[3] = this.fujian_id
        session_id[4] = this.jzwname
        session_id[5] = this.wuguan
        session_id[6] = this.address
        session_id[7] = this.xiaoqu
        console.log(session_id)
        console.log(this.communitylist)
        if(this.communitylist.length!==0){
            sessionStorage.setItem("sqlist_zgf",JSON.stringify(this.communitylist) )
        }
        var xqda_params = {
          path: '/file_query1', //列表或地图页面返回的路径
          cs_cx: { //列表或地图页面查询参数
            dwid: this.street_id,
            sqid: this.communit_id,
            constructName: this.jzwname,
            wyName: this.wuguan,
            addrOrName: this.address,
            xqName: this.xiaoqu,
            haveMap: this.dingwei_id,
            haveFj: this.fujian_id,
          },
          cx_type: 'zgf'
        };
        localStorage.setItem("xqda_params", JSON.stringify(xqda_params));

          var find_params={
            dwid: this.street_id,
            sqid: this.communit_id,
            constructName: this.jzwname,
            wyName: this.wuguan,
            addrOrName: this.address,
            xqName: this.xiaoqu,
            haveMap: this.dingwei_id,
            haveFj: this.fujian_id,
            page:1,
            pageSize:1,
          }
        this.axios.get(this.$global_msg.Url.host + '/zgfinfo/findZgfinfoListByMultiConditions', {
          params:find_params
        }).then((res) => {
          console.log(res)
          if (res.data.code == 0) {
            try {
              plus.nativeUI.closeWaiting();
            } catch (e) {
              console.log('plus问题');
            }
            if (res.data.rows.length == 0) {
              this.showtishi = true
              this.tishiname = "查询无数据！"
            } else {
              if (this.showname == '地图模式') {
                this.$router.push("/mode_map");
                sessionStorage.setItem("session_zgf", JSON.stringify(session_id))
              } else if (this.showname == '列表模式') {
                this.$router.push("/mode_list");
                sessionStorage.setItem("session_zgf", JSON.stringify(session_id))
              } else {
                this.showtishi = true
                this.tishiname = "请选择显示模式!"
              }
            }
          } else {
            this.$toast(res.data.msg)
          }
        }).catch((err) => {
          this.$toast(err)
        })
      }

    },
    created() {
      this.userid = localStorage.getItem("userId")
      console.log(this.userid)
      this.showname = this.show1list[1].mc
      this.axios({
        methods: 'get',
        url: this.$global_msg.Url.host + '/nineStore/selectStreetAndCommunity?userId=' + this.userid,
      }).then((res) => {
        console.log(res)
        if (res.data.rows.lev == 1) { //街道用户
          this.streetname = res.data.rows.jd.mc
          this.street_id = res.data.rows.jd.id
          if (res.data.rows.sq.length == 1) {
            this.communityname = res.data.rows.sq.mc
            this.communit_id = res.data.rows.sq.id
          } else {
            this.communitylist = res.data.rows.sq
          }
        } else if (res.data.rows.lev == 2) { //社区用户
          this.streetname = res.data.rows.jd.mc
          this.street_id = res.data.rows.jd.id
          this.communityname = res.data.rows.sq.mc
          this.communit_id = res.data.rows.sq.id
        } else if (res.data.rows.lev == 0) { //区域用户
          this.streetlist = res.data.rows.jd
        }
        var _this = this
        let arrzgf = JSON.parse(sessionStorage.getItem("session_zgf"))
        console.log(arrzgf)
        if (arrzgf !== null) {
          console.log(arrzgf)
          if (arrzgf[4] !== "") {
            _this.jzwname = arrzgf[4]
          }
          if (arrzgf[5] !== "") {
            _this.wugaun = arrzgf[5]
          }
          if (arrzgf[6] !== "") {
            _this.address = arrzgf[6]
          }
          if (arrzgf[7] !== "") {
            _this.xiaoqu = arrzgf[7]
          }
          if (arrzgf[0] !== "") {
            if (_this.streetname == "请选择" || _this.streetname == "不限") {
              console.log(_this.streetlist)
              _this.streetlist.forEach((v, index) => {
                if (v.id == arrzgf[0]) {
                  _this.streetname = v.mc
                  _this.street_id = arrzgf[0]
                }
              })
            }
          }
          let shequlist_zgf=JSON.parse(sessionStorage.getItem("sqlist_zgf"))
          if (arrzgf[1] !== "") {
            if (_this.communityname == "请选择" || _this.communityname == "不限") {
              console.log(shequlist_zgf)
              shequlist_zgf.forEach((v, index) => {
                if (v.id == arrzgf[1]) {
                  _this.communityname = v.mc
                  _this.communit_id = arrzgf[1]
                  _this.communitylist=shequlist_zgf
                }
              })
            }
          }
          if (arrzgf[2] !== "") {
            _this.dingweilist.forEach((v, index) => {
              if (v.id == arrzgf[2]) {
                _this.dingweiname = v.mc
                _this.dingwei_id = arrzgf[2]
              }
            })
          }
          if (arrzgf[3] !== "") {
            _this.dingweilist.forEach((v, index) => {
              if (v.id == arrzgf[3]) {
                _this.fujianame = v.mc
                _this.fujian_id = arrzgf[3]
              }
            })
          }
        }
      })
    },
  }
</script>

<style scoped>
  .thishiyes {
    width: 1.851851rem;
    background-color: #2B6CFE;
    color: white;
    border-radius: 0.095185rem;
    margin: auto;
    text-align: center;
    padding: 0.2rem 0;
  }

  .tishicont {
    height: 2rem;
    text-align: center;
    line-height: 2rem;
  }

  .list {
    height: 1.388888rem;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-left: 0.3rem;
    margin-right: 0.3rem;
  }

  .list_one img {
    width: 0.4rem;
  }

  .list_two img {
    width: 0.35rem;
    margin-right: 0.2rem;
  }

  .list_two {
    max-height: 6.944444rem;
    height: auto;
    overflow-y: scroll;
  }

  .van-popup {
    width: 90%;
    border-radius: 0.18rem;
  }

  .cont {
    width: 100%;
    border-radius: 0.185185rem;
  }

  .boxx .one {
    margin-left: 0.5rem;
  }

  .boxx .two {
    margin-right: 0.5rem;
  }

  .choose {
    color: #5F5D5C;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: 0.3rem;
  }

  .boxx {
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 1.3rem;
  }

  .yes {
    width: 80%;
    height: 0.825925rem;
    background-color: #2B6CFE;
    text-align: center;
    line-height: 0.825925rem;
    color: white;
    border-radius: 0.095185rem;
    margin-left: 10%;
    margin-top: 1rem;
  }

  input {
    text-align: left;
    /* border: 1px solid red; */
    width: 5.555555rem;
  }
</style>
